﻿@{
    ViewBag.Title = "教学大纲";
    Layout = "~/Views/Shared/_GridCommonLayout.cshtml";
}



<style type="text/css">
    /* 课程介绍部分的css修改 */
    #courseMsg .tab-content > .active, .pill-content > .active {
        display: inline-block;
    }

    #courseMsg .jarviswidget:before, #courseMsg .jarviswidget:after, #courseMsg .jarviswidget > div:before, #courseMsg .jarviswidget > div:after {
        display: none;
    }

    #courseMsg .well {
        border: 0;
    }

    #widget-grid .row {
        padding-bottom: 30px;
    }

    /* 课程提纲部分的css样式 */
    h3 {
        line-height: 32px;
    }

        h3.chapter_catalog {
            font-family: 'Microsoft YaHei','微软雅黑';
            text-decoration: none;
            font-size: 14px;
        }


    #couList .content_area {
        border-top: 1px solid #e4e4e4;
        margin: 5px 10px 0;
    }

    .learnchapter h3, .unlearnchapter h3 {
        background: none repeat scroll 0 0 #edf0f2;
        color: #666565;
        cursor: pointer;
        font-family: 微软雅黑;
        font-size: 16px;
        height: 40px;
        line-height: 40px;
        margin-bottom: 10px;
        overflow: hidden;
        padding: 0 13px 0 0;
    }

        .learnchapter h3 span {
            color: #b4bbbf;
            cursor: pointer;
            display: block;
            float: right;
            font-weight: bold;
            text-align: center;
            width: 10px;
        }

    .learnchapter strong, .unlearnchapter strong {
        color: #666565;
        cursor: default;
        display: block;
        float: left;
        overflow: hidden;
        padding: 0 0 0 20px;
        text-overflow: ellipsis;
        white-space: nowrap;
        width: 345px;
        font-weight: normal;
    }

    .learnchapter em, .unlearnchapter em {
        cursor: default;
        float: right;
        font-size: 12px;
    }

    .learnchapter .video li i {
        background: url("../img/learnicon.png") no-repeat scroll 0 -316px rgba(0, 0, 0, 0);
        display: inline-block;
        float: right;
        height: 40px;
        width: 24px;
    }

    i.hasOpenOn {
        background: url("../img/learnicon.png") no-repeat scroll 0 8px rgba(0, 0, 0, 0);
        display: inline-block;
        height: 40px;
        margin-right: 5px;
        vertical-align: middle;
        width: 20px;
    }

    i.hasOpen {
        background: url("../img/learnicon.png") no-repeat scroll 0 -37px rgba(0, 0, 0, 0);
        display: inline-block;
        height: 40px;
        margin-right: 5px;
        vertical-align: middle;
        width: 20px;
    }

    .learnchapter ul {
        display: none;
    }

    .learnchapter-active ul {
        display: block;
        margin-bottom: 10px;
    }

    .learnchapter h3:hover {
        background: none repeat scroll 0 0 #d0d6d9;
    }

    .learnchapter .video li:last-child {
        border: medium none;
    }

    .learnchapter .video li {
        height: 40px;
        line-height: 40px;
        margin-bottom: 2px;
        padding-left: 40px;
        position: relative;
    }

        .learnchapter .video li:hover {
            background: none repeat scroll 0 0 #f8f8f8;
        }

    .learnchapter .video .studyvideo {
        color: #99a1a6;
        display: block;
        height: 40px;
        overflow: hidden;
        padding: 0 0 0 28px;
        word-break: break-all;
    }
</style>


<!-- widget grid -->
<section id="widget-grid" class="">



    <!--课程介绍 -->

    <div class="row">
        <input type="hidden" value="@ViewBag.CourseID" id="courseID" />
        <h1 class="row-seperator-header"><i class="fa-fw fa fa-book "></i>《@ViewBag.Course.SCourseName》                
        </h1>



        <!-- NEW WIDGET START -->
        <article class="col-sm-12 col-md-12 col-lg-12" id="courseMsg">

            <!-- Widget ID (each widget will need unique ID)-->
            <div class="jarviswidget well" id="wid-id-3" data-widget-colorbutton="false" data-widget-editbutton="false" data-widget-togglebutton="false" data-widget-deletebutton="false" data-widget-fullscreenbutton="false" data-widget-custombutton="false" data-widget-sortable="false">

                <div>

                    <div class="jarviswidget-editbox"></div>

                    <!-- widget content -->
                    <div class="widget-body">

                        <ul id="myTab1" class="nav nav-tabs bordered" style="margin-left: 0">
                            <li class="active">
                                <a href="#s1" data-toggle="tab">课程首页</a>
                            </li>
                            <li>
                                <a href="#s2" data-toggle="tab">教学材料</a>
                            </li>
                            <li>
                                <a href="#s3" data-toggle="tab">题库</a>
                            </li>
                            <li>
                                <a href="#s6" data-toggle="tab">练习</a>
                            </li>                       
                            <li>
                                <a href="#s4" data-toggle="tab">试卷管理</a>
                            </li>
                            <li>
                                <a href="#s5" data-toggle="tab">阅卷</a>
                            </li>
                        </ul>

                        <div id="myTabContent1" class="tab-content padding-10">
                            <div class="tab-pane fade in active" id="s1" style="width: 100%;">
                                <div class="col-xs-12 col-sm-6 col-md-8">
                                    <h3>课程介绍
                                        <a style="font-size: 13px; color: black;" class="btn btn-success pull-right"
                                            href="#myModal" role="button" data-toggle="modal">修改课程介绍</a>
                                    </h3>

                                    <hr />
                                    <p id="ScourseIntro">@Html.Raw(@ViewBag.Course.SIntro)</p>
                                </div>
                                <div class="col-xs-6 col-md-4">
                                    <a href="#" class="thumbnail">
                                        <img alt="课程图像" style="height: 200px; width: 100%; display: block;" src='@ViewBag.Course.SImgUrl'>
                                    </a>
                                </div>
                                <!-- 课程提纲 -->
                                <div class="row ">
                                    <article class="col-sm-12 col-md-12 col-lg-12" id="couList">
                                        <h3>课程提纲 | <a href="/Teacher/TeachingOutline?id=@ViewBag.CourseID" style="color:#666565;font-size:15px;">编辑</a></h3>
                                        <div class="content_area">
                                            @{
                                                List<HyEduOnline.Entities.TbTeaCatalog> zhang = new List<HyEduOnline.Entities.TbTeaCatalog>();
                                                List<HyEduOnline.Entities.TbTeaCatalog> jie = new List<HyEduOnline.Entities.TbTeaCatalog>();

                                                int i = 0;
                                                //将章与节分开
                                                foreach (var item in ViewBag.teaCatalog)
                                                {
                                                    if (item.IParentId == 0)
                                                    {
                                                        zhang.Add(item);
                                                    }
                                                    else
                                                    {
                                                        jie.Add(item);
                                                    }
                                                }
                                                //外层循环 章
                                                foreach (var item in zhang)
                                                {
                                                <div class="learnchapter learnchapter-active">
                                                    <h3>
                                                        <span>-</span>
                                                        <strong><i class="hasOpenOn"></i>@item.SCaptailName &nbsp;  @item.STitle</strong>
                                                    </h3>
                                                    <ul class="video" style="display: block">
                                                        @foreach (var ite in jie)
                                                        {//内层循环 节
                                                            if (ite.IParentId == item.Id)
                                                            {                              
                                                            <li class="studyvideo">@ite.SCaptailName &nbsp;  @ite.STitle (@ite.IHourse 课时)</li>
                                                            }
                                                        }
                                                    </ul>
                                                </div>
                                                }
                                            }

                                        </div>

                                    </article>
                                </div>
                            </div>

                            <div class="tab-pane fade" id="s2" style="width: 100%;">
                                <iframe  style="padding:0; margin:0; width: 100%; min-height: 1200px;" src="/Teacher/PublicResource?CourseID=@ViewBag.CourseID"  frameborder="0" scrolling="0"></iframe>
                            </div>


                            <div class="tab-pane fade" id="s6" style="width: 100%;">
                                <iframe  style="padding:0; margin:0; width: 100%; min-height: 1200px;" src="/Teacher/Practice?courseId=@ViewBag.CourseID"  frameborder="0" scrolling="0"></iframe>
                            </div>

                            <div class="tab-pane fade" id="s3" style="width: 100%; margin: 0; padding: 0;">
                                <iframe  style="padding:0; margin:0; width: 100%; min-height: 1200px;" src="/TeacherManger/TestLib?CourseID=@ViewBag.CourseID"  frameborder="0" scrolling="0"></iframe>
                            </div>


                            <div class="tab-pane fade" id="s4" style="width: 100%;">
                                <iframe  style="padding:0; margin:0; width: 100%; min-height: 1200px;" src="/TeacherManger/TestLibExamView?CourseID=@ViewBag.CourseID"  frameborder="0" scrolling="0"></iframe>
                            </div>

                            <div class="tab-pane fade" id="s5" style="width: 100%;">
                                <iframe  style="padding:0; margin:0; width: 100%; min-height: 1200px;" src="/Teacher/PaperList?courseId=@ViewBag.CourseID"  frameborder="0" scrolling="0"></iframe>
                            </div>
                        </div>

                    </div>
                    <!-- end widget content -->

                </div>
                <!-- end widget div -->

            </div>
            <!-- end widget -->

        </article>
        <!-- WIDGET END -->



    </div>

    <!-- end row -->


</section>
<!-- end widget grid -->

<!--修改课程介绍-->
<div id="myModal" class="modal fade" tabindex="1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="false">
    <div class="modal-header" style="background-color: #f5f5f5">
        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
        <h3 id="myModalLabel">修改课程介绍</h3>
    </div>
    <div class="modal-body" style="background-color: white;">
        <div class="click2edit" style="height: 400px;"></div>
    </div>
    <div class="modal-footer" style="background-color: #f5f5f5; margin-top: 0px">
        <button class="btn" data-dismiss="modal" aria-hidden="true">关闭</button>
        <button class="btn btn-primary" id="saveInfor">保存</button>
    </div>
</div>
<!--修改课程介绍end-->

<script src="~/Js/plugin/summernote/summernote.js"></script>
<script type="text/javascript">

    //初始化编辑器
    var edit = function () {
        $('.click2edit').summernote({ focus: true });
    };
    $(function () {

        edit();

        $(".note-editable").css("height", "310px");

        var intro = $("#ScourseIntro").text();
        $(".note-editable").prepend(intro);

        //修改课程介绍
        $("#saveInfor").click(function () {
            var Infro = $(".note-editable").code();
            var courseID = $("#courseID").val();
            var course = { Id: courseID, SIntro: Infro };
            $.ajax({
                type: "POST",
                contentType: "application/json; charset=utf-8",
                url: "/Api/Teacher/ModifyContent",
                data: JSON.stringify(course)
            }).done(function (data) {
                if (data == 1) {
                    window.location.reload();
                }
                else {
                    alert("请刷新页面，重试！");
                }
            })
        })
    });

    function recList() {

        $(".main .year .list").each(function (e, target) {
            var $target = $(target),
            $ul = $target.find("ul");
            $target.height($ul.outerHeight()), $ul.css("position", "absolute");
        });
    };
    $(".main .year>h2>a").click(function (e) {
        e.preventDefault();
        $(this).parents(".year").toggleClass("close");
    });

    $(".main .year>.list .intro").click(function (e) {
        e.preventDefault();
        $(this.parentNode).toggleClass("close");
        recList();
        //alert("click");
        //$(this).parents(".year").toggleClass("close");
    });

    //课程章节收缩/展开  by zjb
    $('.learnchapter h3').click(function () {
        if ($(this).parent().hasClass('learnchapter-active')) {
            $(this).next('.video').slideUp('fast', function () { $(this).parent().removeClass('learnchapter-active'); });
            $(this).find('span').html('+');
            $(this).find('i').removeClass('hasOpenOn');
            $(this).find('i').addClass('hasOpen');
        } else {
            $(this).next('.video').slideDown('fast', function () { $(this).parent().addClass('learnchapter-active'); });
            $(this).find('span').html('-');
            $(this).find('i').removeClass('hasOpen');
            $(this).find('i').addClass('hasOpenOn');
        }


    });
</script>


